window.onload = function(){ 
    var input = document.getElementById("file_input");   
    var result;    
    var dataArr = []; // 储存所选图片的结果(文件名和base64数据)  
    var oSelect = document.getElementById("select");  
    var oInput = document.getElementById("file_input");
    var oldImg = document.getElementById("oldImg");
    
    if(typeof FileReader==='undefined'){    
        alert("抱歉，你的浏览器不支持 FileReader");    
        input.setAttribute('disabled','disabled');    
    }else{    
        input.addEventListener('change',readFile,false);
    }　　　　　//handler    
    
        
    function readFile(){  
        var index = 0;  
            if (!input['value'].match(/.jpg|.gif|.png|.bmp/i)){　　//判断上传文件格式    
                return alert("上传的图片格式不正确，请重新选择");    
            }  
            var reader = new FileReader(); 
            reader.readAsDataURL(this.files[0]);  //转成base64    
            reader.fileName = this.files[0].name;  
  
  
            reader.onload = function(e){   
                var imgMsg = this.result   //reader.readAsDataURL方法执行完后，base64数据储存在reader.result里    
                console.log(imgMsg)
                oldImg.remove();
                result = '<div class="delete">delete</div><div class="result"><img src="'+this.result+'" alt=""/><input id="infoSrc" name="infoSrc" type="hidden" value="'+this.result+'" /></div>';    
                var div = document.createElement('div');  
                div.innerHTML = result;    
                div['className'] = 'float';  
                div['index'] = index;    
                document.getElementById('image').appendChild(div);  　　//插入dom树   
                var img = div.getElementsByTagName('img')[0];  
                img.onload = function(){    
                    var nowHeight = ReSizePic(this); //设置图片大小    
                    this.parentNode.style.display = 'block';    
                    var oParent = this.parentNode;    
                    if(nowHeight){    
                        oParent.style.paddingTop = (oParent.offsetHeight - nowHeight)/2 + 'px';    
                    }    
                }   
  
                div.onclick = function(){  
                    this.remove();                  // 在页面中删除该图片元素  
                    delete imgMsg;  // 删除dataArr对应的数据  
                    $("#file_input").val('');
                      
                }  
                index++;  
        }    
    }    
        
    oSelect.onclick=function(){   
        oInput.value = "";   // 先将oInput值清空，否则选择图片与上次相同时change事件不会触发  
        //清空已选图片  
        $('.float').remove(); 
        imgMsg = '';   
        index = 0;          
        oInput.click();   
    }   
}    
/*    
 用ajax发送fd参数时要告诉jQuery不要去处理发送的数据，    
 不要去设置Content-Type请求头才可以发送成功，否则会报“Illegal invocation”的错误，    
 也就是非法调用，所以要加上“processData: false,contentType: false,”    
 * */    
    
function ReSizePic(ThisPic) {    
    var RePicWidth = 200; //这里修改为您想显示的宽度值    
    
    var TrueWidth = ThisPic.width; //图片实际宽度    
    var TrueHeight = ThisPic.height; //图片实际高度    
        
    if(TrueWidth>TrueHeight){    
        //宽大于高    
        var reWidth = RePicWidth;    
        ThisPic.width = reWidth;    
        //垂直居中    
        var nowHeight = TrueHeight * (reWidth/TrueWidth);    
        return nowHeight;  //将图片修改后的高度返回，供垂直居中用    
    }else{    
        //宽小于高    
        var reHeight = RePicWidth;    
        ThisPic.height = reHeight;    
    }    
}  
